<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta charset="utf-8">
		<title>个人测评统计分析报告</title>
		<link rel="stylesheet" type="text/css" href="../layui/css/layui.css"/>
		<style type="text/css">
			.perEvaluation-con{
				padding:0 15px 15px 15px;
			}
			.perEvaluation-con .not_border_left {
				border-left: none !important;
			}
			.perEvaluation-con .articletype dl dd.layui-this{
				background-color: #1E9FFF !important;
			}
			.perEvaluation-con .layui-table,.layui-table-view{
				border: none;
				margin-top: 0px;
			}
			.perEvaluation-con .layui-table-body table tbody .layui-table-hover{
				background: #fffdd3 !important;
			}
			.perEvaluation-con .layui-table-body table tbody .layui-table-click{
				background: #fdef9b !important;
			}
		</style>
	</head>
	<body>
	<div class="perEvaluation-con">
		<!--顶部查询框Start-->
		<blockquote class="layui-elem-quote not_border_left">
			<form class="layui-form" action="">	
				<div class="layui-inline">
					<div class="layui-input-inline articletype">
					    <select name="articletype" id="articletype" lay-filter="articletype" lay-event="role">
					        <option value="0">请选择测试时间段</option>
					        <option value="1">2017-2018</option>
					        <option value="2">2016-2017</option>
					        <option value="3">2015-2016</option>
					        <option value="4">2014-2015</option>
					        <option value="5">2013-2014</option>
					        <option value="6">2012-2013</option>
					        <option value="7">2011-2012</option>
					        <option value="8">2010-2011</option>
					    </select>
					</div>
					<div class="layui-input-inline articletype">
					    <select name="reportType" id="reportType" lay-filter="reportType" lay-event="reportType">
					        <option value="0">请选择测试报告类型</option>
					    </select>
					</div>
					<div class="layui-input-inline articletype">
					    <select name="grade" id="grade" lay-filter="grade" lay-event="grade">
					        <option value="0">请选择年级</option>
					    </select>
					</div>
					<div class="layui-input-inline articletype">
					    <select name="className" id="className" lay-filter="className" lay-event="className">
					    </select>
					</div>
					
				    <div class="layui-inline">
	      				<button class="layui-btn layui-bg-blue" lay-event="seleBtn" lay-submit="" lay-filter="demo1">查询</button>
				    </div>
				</div>	
			</form>
		</blockquote>
		<!--顶部查询框End-->
		
		<!--中间表格部分Start-->
		<table class="layui-hide" id="student" lay-filter="student"></table>
		
		<script type="text/html" id="barDemo">
			<a href="javascript:" class="layui-btn layui-btn-xs layui-btn-normal" lay-event="analysis">维度分析</a>	
			<a href="javascript:" class="layui-btn layui-btn-xs layui-btn-normal" lay-event="printing">报告打印</a>	
		</script>
	</div>
	<script src="../js/jquery-3.3.1.js"></script>
	<script src="../layui/layui.js"></script>
	<script>
		layui.use(['table','form','layer','laydate','laytpl','element'], function() {
			var table = layui.table;
			form = layui.form,
	        layer = parent.layer === undefined ? layui.layer : top.layer,
	        $ = layui.jquery,
	        laydate = layui.laydate,
	        laytpl = layui.laytpl,
	        element = layui.element;
	        
	        /*动态加载测试报告类型下拉框*/
			$.ajax({
				type : 'get',
				url : '../json/sysJson/testReportType.json',
				datatype : 'json',
				success : function(typedate) {
					if (typedate.code == 0) {
						var str = "";
						for(var i = 0; i < typedate.count; i++){
							str += '<option value=' + typedate.data[i].id + '>'+ typedate.data[i].name+'</option>';
						}
						$("#reportType").append(str);
						form.render("select");
					}
					else{
						layer.msg("测试报告类型获取失败");
					}
				}
			});
			
			/*动态加载年级下拉框*/
			$.ajax({
				type : 'get',
				url : '../json/grade.json',
				datatype : 'json',
				success : function(gradedate) {
					if (gradedate.code == 0) {
						var str = "";
						for(var i = 0; i < gradedate.count; i++){
							str += '<option value=' + gradedate.data[i].gradename + '>'+ gradedate.data[i].gradename+'</option>';
						}
						$("#grade").append(str);
						form.render("select");
					}
					else{
						layer.msg("年级信息获取失败");
					}
				}
			});
			
			form.on('select(grade)', function(data) {
				var grade=data.value;
				/*动态加载班级下拉框*/
				$("#className").html("");
				$.ajax({
					type : 'get',
					url : '../sysclassmanagement/getclassbygrade?grade='+grade,
					datatype : 'json',
					success : function(classdate) {
						if (classdate.code == 0) {
							var str = "<option value='00'>请选择班级</option>";
							for(var i = 0; i < classdate.count; i++){
								str += '<option value=' + classdate.data[i].classid + '>'+ classdate.data[i].className +'</option>';
							}
							$("#className").append(str);
							form.render("select");
						}
						else{
							$("#className").html("");
							layer.msg("暂无对应的班级");
							form.render("select");
						}
					}
				});
			});
	        
	        table.render({
				elem: '#student',
				url: '../json/PersonalEvalAnalysis.json',
				title: '用户数据表',
				height: "full-120",
				skin: 'line',
				even: true,
				cols: [
					[{
						field: 'stuName',
						title: '姓名',
						align: 'center',
						width: '10%'
					},{
						field: 'className',
						title: '班级',
						align: 'center',
						width: '20%'
					}, {
						field: 'paperName',
						title: '测评报告类型',
						align: 'center',
						width: '30%'
					}, {
						field: 'createTime',
						title: '测评时间',
						align: 'center',
						width: '20%'
					}, {
						title: '操作',
						toolbar: '#barDemo',
						align: 'center',
						width: '20%'
					}]
				],page: {
					layout: ['prev', 'page', 'next', 'skip', 'count', 'limit'],
					groups: 5,
					limit: 10,
					limits: [10, 20, 30, 40, 50],
					theme: '#1E9FFF',					
				}
			});
	        //监听行工具事件
		    table.on('tool(student)', function(obj){
			    var data = obj.data;
			    if(obj.event === 'analysis'){
			    	var index = layer.open({
						type: 2, 
					    title: '个人维度分析',
				        area: ['830px', '95%'],
				        shade: 0.8,
				        maxmin: true,
				        content: ['../evaluationResult/ClassMHTStatisDefault.jsp','yes'],
				        cancel: function(){ 
						}
				    });
			    	layer.full(index);
			    }
			    if(obj.event === 'printing'){
			    	var index=layer.open({
						type: 2, 
					    title: '修改学生信息',
				        area: ['830px', '95%'],
				        shade: 0.8,
				        maxmin: true,
				        content: ['studentcheckarchive.jsp'],
				        cancel: function(){ 
						   /* $(".editparlayer-con").css("display","none"); */
						}
				    });
			    	layer.full(index);
			    }
		    });
		});
	</script>
	</body>
</html>